import { createRouter, createWebHashHistory } from "vue-router";

const home = () => import("../pages/home/index.vue");
const example1 = () => import("../pages/three/example1.vue");
const example2 = () => import("../pages/three/example2.vue");
const text = () => import("../pages/three/text.vue");
const example3 = () => import("../pages/three/example3.vue");
const example4 = () => import("../pages/three/example4.vue");
const example5 = () => import("../pages/three/example5.vue");

const cssModules = () => import("../pages/css_modules/test.vue");

const basicRoutes = [
  { path: "/", redirect: "/home" },
  {
    path: "/home",
    component: home,
    name: "home"
  }
];

export const routes = [
  {
    path: "/three/example1",
    component: example1,
    name: "example1",
    title: "threejs 画线",
    desc: "使用threejs画线"
  },
  {
    path: "/three/example2",
    component: example2,
    name: "example2",
    title: "threejs 立方体",
    desc: "使用threejs创建一个立方体"
  },
  {
    path: "/three/text",
    component: text,
    name: "text",
    title: "threejs 加载一个文本",
    desc: "使用threejs加载一个文本"
  },
  {
    path: "/three/example3",
    component: example3,
    name: "example3",
    title: "gasp 动画",
    desc: "使用gasp动画"
  },
  {
    path: "/three/cssModules",
    component: cssModules,
    name: "cssModules",
    title: "css Modules",
    desc: "css Modules 设置主题"
  },
  {
    path: "/three/example4",
    component: example4,
    name: "example4",
    title: "threejs的光源",
    desc: "使用threejs的光源设置"
  },
  {
    path: "/three/example5",
    component: example5,
    name: "example5",
    title: "threejs的光源",
    desc: "使用threejs的聚光灯设置"
  }
];

export const router = createRouter({
  history: createWebHashHistory(),
  routes: [...basicRoutes, ...routes]
});
